'use strict';
/**室内基本 */
/**
 * 默认配置
 */
var config = {
    id: '200000',
    name: '江苏省',
    userId: '3',
    cid: '003'//客户别
};
var chartsdata=null;//图标数据
/**
 * 公共调用模块
 */
$(function () {
    Layout('.data_content');
    var rq = $.getRequest();
    let id = rq.id || config.id;
    let name = rq.name || config.name;
    let cid = rq.tenantNo || config.cid;
    let userId = getStorage("loginUserId");
    userId = userId || rq.userId || config.userId;
    setStorage("loginUserId", userId);
    setStorage('siteInfo', { id: id, name: name, cid: cid });
    ControlChears();
    $("#fsiteName").text(name);
    $("#mytables").niceScroll()
    setInterval(function () {
        updateTime();
    }, 1000);
    $(".table-warp").niceScroll()

});

//
$("#radio1").click(function(){
    $(".radio").removeClass("activeradio");
    $("#radio1").addClass("activeradio");
    reloadchartAqi24("chartAqi24",undefined,1);
})
$("#radio2").click(function(){
    $(".radio").removeClass("activeradio");
    $("#radio2").addClass("activeradio");
    reloadchartAqi24("chartAqi24",undefined,2);
})
$("#radio3").click(function(){
    $(".radio").removeClass("activeradio");
    $("#radio3").addClass("activeradio");
    reloadchartAqi24("chartAqi24",undefined,3);
})
$("#radio4").click(function(){
    $(".radio").removeClass("activeradio");
    $("#radio4").addClass("activeradio");
    reloadchartAqi24("chartAqi24",undefined,4);
})
$("#radio5").click(function(){
    $(".radio").removeClass("activeradio");
    $("#radio5").addClass("activeradio");
    reloadchartAqi24("chartAqi24",undefined,5);
})
$("#radio6").click(function(){
    $(".radio").removeClass("activeradio");
    $("#radio6").addClass("activeradio");
    reloadchartAqi24("chartAqi24",undefined,6);
})
//更新时间
function updateTime() {
    var $timewarper = $('.time-content', '#time');
    if ($timewarper.length <= 0) {
        $timewarper = $("<span class='time-content'></span>");
        $("#time").prepend($timewarper);
    }
    var t = $.getTime();
    var time = t.y + "-" + t.m + "-" + t.d + "   星期" + t.w + "   " + t.h + ":" + t.M + ":" + t.s;
    $timewarper.html(time);
}

function reloadExponen(aqi) {
    var index = getAqiIndex(aqi);
    // var $quality = $("#quality");
    // $quality.addClass('label').addClass('lagend' + (index + 1));
    // $quality.text(getAqiDes(index));
    $("#exponent").css('color', getColor(index));
    if (index >= 0) {
        $("#level").text((index + 1) + '级');
    }
    else {
        $("#level").text('暂无数据');
    }
    $("#icon").attr('src', '../images/ico_0' + (index + 1) + '.png');
};

//仪表盘
function ControlChears(){
    var chartDom = document.getElementById('ControlChears');
        var myChart = echarts.init(chartDom);
        var option;
        option = {
            angleAxis: {
                show: false,
                max: 100 * 360 / 270, //-45度到225度，二者偏移值是270度除360度
                type: 'value',
                startAngle: 225, //极坐标初始角度
                splitLine: {
                    show: false
                }
            },
            barMaxWidth: 12, //圆环宽度
            radiusAxis: {
                show: false,
                type: 'category',
            },
            //圆环位置和大小
            polar: {
                center: ['50%', '50%'],
                radius: '135'
            },
            series: [
            { //下层圆环，显示最大值
                type: 'bar',
                data: [{
                    value: 100,
                    itemStyle: {
                        color: { //图形渐变颜色方法，四个数字分别代表，右，下，左，上，offset表示0%到100%
                            type: 'linear',
                            x: 0,
                            y: 0,
                            x2: 1, //从左到右 0-1
                            y2: 0,
                            colorStops: [{
                                offset: 0,
                                color: '#90C9C8'
                            }, {
                                offset: 1,
                                color: '#EE853A'
                            }],
                        },
                    }
                }],
                barGap: '-100%',
                coordinateSystem: 'polar',
                roundCap: true,
                z: 1
            },
            //仪表盘
            {
                name: 'AQI',
                type: 'gauge',
                startAngle: 225, //起始角度，同极坐标
                endAngle: -45, //终止角度，同极坐标
                axisLine: {
                    show: false,
                },
                splitLine: {
                    show: false
                },
                axisTick: {
                    show: false
                },
                axisLabel: {
                    show: false
                },
                splitLabel: {
                    show: false
                },
                pointer: {
                  icon: 'circle',
                  length: '35%',
                  width: 100,
                  offsetCenter: [0, '-104%'],
                  itemStyle: {
                    color: '#fff',
                    borderColor: '#A3D2D9', // This doesn't work :(
                    borderWidth: 5,
                  },
              },
                title: {
                    offsetCenter: [5,40],
                    color: '#000000',
                    fontSize: 15,
                    fontWeight: 500,
                    rich: {
                        a: {
                            fontWeight: 'normal',
                            fontSize: 16,
                            color: '#FFF',
                        }
                    }
                },
                detail: {
                    formatter: function (e) {
                        return '优';
                    },
                    color: '#90C9C8',
                    fontSize: 40,
                    offsetCenter: [0, -5],
                    borderRadius: 8,
            
                },
                data: [{
                    value: 20,
                    name: "空气指数",
                    fontSize: 16,
                }]
            }
            ]
        }
        option && myChart.setOption(option);
}
/**
 * 更新24小时AQI
 * @id 站点编号
 * @charId 图表编号
 */
function updateAqifor24(id, chartId) {
    api.getsiteAqi2(id, function (d) {
        reloadchartAqi24(chartId, d);
    });
};

function refreshAqifor24(id, chartId) {
    api.getsiteAqi2(id, function (d) {
        refreshChartline24(chartId, d);
    });
};

function updateAqi2(id, chartId) {
    api.getsiteAqi2(id, function (d) {
        reloadchartAqi24(chartId, d);
    });
};


/**
 * 刷新24小时空气各项数据
 * @id 图表编号
 * @data 数据
 */
function refreshChartline24(id, data) {
    var myChart = echarts.init(document.getElementById(id));

    let xArray = data.map(function (item) {
        return item.fhour + ' 时';
    });

    let pm25Array = data.map(function (item) {
        return item.fpm25;
    });
    let pm10Array = data.map(function (item) {
        return item.fpm10;
    });
    let no2Array = data.map(function (item) {
        return item.fjq;
    });
    let so2Array = data.map(function (item) {
        return item.fyjw;
    });
    let coArray = data.map(function (item) {
        return item.fco2;
    });
    let o3Array = data.map(function (item) {
        return item.fwd2;
    });


    let option = myChart.getOption();
    option.xAxis.data = xArray;
    option.series[0].data = pm25Array;
    option.series[1].data = pm10Array;
    option.series[2].data = no2Array;
    option.series[3].data = so2Array;
    option.series[4].data = coArray;
    option.series[5].data = o3Array;
    myChart.clear();
    myChart.setOption(option);
}

/**
 * 各项数据
 * @id 图表编号
 * @data 数据
 */
// rev true表示升序排列，false降序排序
function sortByArr(arr, rev) {
    if (rev == undefined) {
        rev = 1;
    } else {
        rev = (rev) ? 1 : -1;
    }
    return function (a, b) {
        for (var i = 0; i < arr.length; i++) {
            let attr = arr[i]
            if (a[attr] != b[attr]) {
                if (a[attr] > b[attr]) {
                    return rev * 1;
                } else {
                    return rev * -1;
                }
            }
        }
    }
}
let intervalLine
function reloadchartAqi24(id,data,type) {
    // clearInterval(intervalLine)
    if(data!=undefined)
    {
        chartsdata=data;
    }
    var seriesdata={
        name: 'PM2.5',
        type: 'line',
        label: {
            show: true,
            color: '#9CA0A7',
        },
        data: tabledata,
        areaStyle: {
            opacity: 0.15
        },
    };
    var datas = chartsdata.sort(sortByArr(['fhour'],true))
    let xArray = datas.map(function (item) {
        return item.fhour + ' 时';
    });
    let pm25Array = chartsdata.map(function (item) {
        return item.fpm25;
    });
    let pm10Array = chartsdata.map(function (item) {
        return item.fpm10;
    });
    let no2Array = chartsdata.map(function (item) {
        return item.fjq;
    });
    let so2Array = chartsdata.map(function (item) {
        return item.fyjw;
    });
    let coArray = chartsdata.map(function (item) {
        return item.fco2;
    });
    let o3Array = chartsdata.map(function (item) {
        return item.fwd2;
    });
    var tabledata=null;
    switch(type){
        case 1:
            tabledata=pm25Array;
            seriesdata={
                name: 'PM2.5',
                type: 'line',
                label: {
                    show: true,
                    color: '#A3D2D9',
                },
                lineStyle:{
                    color:'#A3D2D9'
               },
               itemStyle: {
                   color: '#A3D2D9' // 数据点颜色
               },
                data: tabledata,
                areaStyle: {
                    opacity: 0.15
                },
            };
            break;
        case 2:
            tabledata=pm10Array;
            seriesdata={
                name: 'PM10',
                type: 'line',
                label: {
                    show: true,
                    color: '#A3AED9',
                },
                lineStyle:{
                    color:'#A3AED9'
               },
               itemStyle: {
                   color: '#A3AED9' // 数据点颜色
               },
                data: tabledata,
                areaStyle: {
                    opacity: 0.15
                },
            };
            break;
        case 3:
            tabledata=no2Array;
            seriesdata={
                name: '甲醛',
                type: 'line',
                label: {
                    show: true,
                    color: '#A6BFDC',
                },
                lineStyle:{
                    color:'#A6BFDC'
               },
               itemStyle: {
                   color: '#A6BFDC' // 数据点颜色
               },
                data: tabledata,
                areaStyle: {
                    opacity: 0.15
                },
            };
            break;
        case 4:
            tabledata=so2Array;
            seriesdata={
                name: '挥发性物质',
                type: 'line',
                label: {
                    show: true,
                    color: '#DECAE1',
                },
                lineStyle:{
                    color:'#DECAE1'
               },
               itemStyle: {
                   color: '#DECAE1' // 数据点颜色
               },
                data: tabledata,
                areaStyle: {
                    opacity: 0.15
                },
            };
            break;
        case 5:
            tabledata=coArray;
            seriesdata={
                name: 'CO2',
                type: 'line',
                label: {
                    show: true,
                    color: '#A3D2D9',
                },
                lineStyle:{
                    color:'#A3D2D9'
               },
               itemStyle: {
                   color: '#A3D2D9' // 数据点颜色
               },
                data: tabledata,
                areaStyle: {
                    opacity: 0.15
                },
            };
             break;
        case 6:
            tabledata=o3Array;
            seriesdata={
                name: '温度',
                type: 'line',
                label: {
                    show: true,
                    color: '#DECAE1',
                },
                lineStyle:{
                     color:'#DECAE1'
                },
                itemStyle: {
                    color: '#DECAE1' // 数据点颜色
                },
                data: tabledata,
                areaStyle: {
                    opacity: 0.2
                },
            };
            break;
        default:
            tabledata=pm25Array;
            seriesdata={
                name: 'PM2.5',
                type: 'line',
                label: {
                    show: true,
                    color: '#A3D2D9',
                },
                lineStyle:{
                    color:'#A3D2D9'
               },
               itemStyle: {
                   color: '#A3D2D9' // 数据点颜色
               },
                data: tabledata,
                areaStyle: {
                    opacity: 0.15
                },
            };
            break;
    }
    var myChart = echarts.init(document.getElementById(id));
    var option = {
        tooltip: {
            trigger: 'axis'
        },
        grid: {
            top: '28%',
            left: '5%',
            right: '5%',
            bottom: '0%',
            containLabel: true
        },
        xAxis: {
            type: 'category',
            boundaryGap: false,
            data: xArray,
            splitLine: {
                show: false
            },
            axisLine: {
                lineStyle: {
                    color: '#9CA0A7'
                }
            }
        },
        yAxis: {
            name: '',
            type: 'value',
            splitLine: {
                show: false
            },
            axisLabel: {
                show: false,
                textStyle: {
                    color: '#9CA0A7',
                    fontSize: '10'
                }
            },
            axisLine: {
                lineStyle: {
                    color: '#9CA0A7'
                }
            }
        },
        series: seriesdata
    }
    myChart.setOption(option,true);

    myChart.index = 0;
    myChart.total = xArray.length;

    var showTip = function () {
        myChart.dispatchAction({
            type: 'showTip',
            seriesIndex: '0',
            dataIndex: myChart.index
        });
        myChart.index += 1;
        if (myChart.index > myChart.total) {
            myChart.index = 0;
        }
    }

    // intervalLine = setInterval(showTip, 2000);
    // myChart.on('mouseover', function () {
    //     clearInterval(intervalLine);
    // })
    // myChart.on('mouseout', function () {
    //     intervalLine = setInterval(showTip, 2000);
    // })
    // return myChart;
}
/**
 * 各项数据
 * @id 图表编号
 * @data 数据
 */
function reloadChartLine24(id, data) {
    let xArray = data.map(function (item) {
        return item.datePart + ' 时';
    });

    let pm25Array = data.map(function (item) {
        return item.fmoniterPm25;
    });
    let pm10Array = data.map(function (item) {
        return item.fmoniterPm10;
    });
    let no2Array = data.map(function (item) {
        return item.fmoniterNo2;
    });
    let so2Array = data.map(function (item) {
        return item.fmoniterSo2;
    });
    let coArray = data.map(function (item) {
        return item.fmoniterCo;
    });
    let o3Array = data.map(function (item) {
        return item.fmoniterO3;
    });
    var myChart = echarts.init(document.getElementById(id));

    var option = {
        tooltip: {
            trigger: 'axis'
        },
        color: ['#2db7f5', '#ff6600', '#808bc6', '#ff0', '#B386B8', '#DADEBF'],
        legend: {
            top: 20,
            padding: 5,
            textStyle: {
                color: '#ffffff'
            },
            icon: 'pin',
            data: ['PM2.5', 'PM10', '二氧化氮', '二氧化硫', '一氧化碳', '臭氧']
        },
        grid: {
            top: '20%',
            left: '3%',
            right: '4%',
            bottom: '3%',
            containLabel: true
        },
        xAxis: {
            type: 'category',
            boundaryGap: false,
            data: xArray,
            splitLine: {
                show: false
            },
            axisLine: {
                lineStyle: {
                    color: '#FFFFFF'
                }
            }
        },
        yAxis: {
            name: '',
            type: 'value',
            splitLine: {
                show: false
            },
            axisLabel: {
                show: false,
                textStyle: {
                    color: '#FFFFFF',
                    fontSize: '10'
                }
            },
            axisLine: {
                lineStyle: {
                    color: '#fff'
                }
            }
        },
        series: [{
            name: 'PM2.5',
            type: 'line',
            label: {
                show: true,
                color: '#fff',
            },
            data: pm25Array,
        },
        {
            name: 'PM10',
            type: 'line',
            label: {
                show: true,
                color: '#fff',
            },
            data: pm10Array
        },
        {
            name: '二氧化氮',
            type: 'line',
            label: {
                show: true,
                color: '#fff',
            },
            data: no2Array
        },
        {
            name: '二氧化硫',
            type: 'line',
            label: {
                show: true,
                color: '#fff',
            },
            data: so2Array
        },
        {
            name: '一氧化碳',
            type: 'line',
            label: {
                show: true,
                color: '#fff',
            },
            data: coArray
        },
        {
            name: '臭氧',
            type: 'line',
            label: {
                show: true,
                color: '#fff',
            },
            data: o3Array
        }
        ]
    }
    myChart.setOption(option);

    myChart.index = 0;
    myChart.total = xArray.length;

    var showTip = function () {
        myChart.dispatchAction({
            type: 'showTip',
            seriesIndex: '0',
            dataIndex: myChart.index
        });
        myChart.index += 1;
        if (myChart.index > myChart.total) {
            myChart.index = 0;
        }
    }

    myChart.setInterval = setInterval(showTip, 2000);
    myChart.on('mouseover', function () {
        clearInterval(myChart.setInterval);
    })
    myChart.on('mouseout', function () {
        myChart.setInterval = setInterval(showTip, 2000);
    })
    return myChart;
}

/**
 * 更新设备状态
 * @id 站点编号
 * @charId 图表编号
 */
function updateDeviceStatus(id, chartId) {
    var data={
        "list": [
            {
                "name": "联网",
                "value": 68
            },
            {
                "name": "断网",
                "value": 19
            }
        ],
        "total": 87
    }
    reloadChartPie(id, chartId, data);
}

function refreshDeviceStatus(id, chartId) {
    api.getDeviceStatus(id, function (d) {
        refreshChartPie(id, chartId, d);
    });
}

/*刷新设备信息 */
function refreshChartPie(id, chartId) {
    var myChart = echarts.init(document.getElementById(chartId));
    api.getDeviceStatus(id, function (data) {
        console.log('刷新设备信息');
        // let option = myChart.getOption();
        // option.title.subtext = data.total;
        // option.series[0].data = data.list;
        // myChart.clear();
        // myChart.setOption(option);
    });
}

/**
 * 加载设备连接状态
 * @id 组织编号
 * @chartId 图表编号
 * @data 数据
 */
let rotateIntervalClear
let setIntervalClear
function reloadChartPie(id, chartId, data) {
    if(data.list.length>0)
    {
        $("#lw").text(data.list[0].value);
        $("#dw").text(data.list[1].value);
    }
    clearInterval(rotateIntervalClear)
    clearInterval(setIntervalClear)
    var myChart = echarts.init(document.getElementById(chartId));
    var option  = {
        title: {
          text: '设备总数', // 圆环中间数字
          textStyle: {
            color: 'rgba(48,65,102,0.5)',
            fontSize: 12,
          },
          subtext: data.list[0].value+data.list[1].value,
          subtextStyle: {
            color: '#304166',
            fontSize: 30,
            fontWeight:"bold",
          },
          itemGap: 10,
          left: 'center',
          top: '37%',
        },
        angleAxis: {
          max: data.list[0].value+data.list[1].value, // 总数
          clockwise: false, // 逆时针
            show: false,
          },
          axisTick: {
            show: false,
          },
          axisLabel: {
            show: false,
          },
          splitLine: {
            show: false,
          },
        radiusAxis: {
          type: 'category',
          // 隐藏刻度线
          axisLine: {
            show: false,
          },
          axisTick: {
            show: false,
          },
          axisLabel: {
            show: false,
          },
          splitLine: {
            show: false,
          },
        },
        polar: {
          center: ['50%', '50%'],
          radius: '120%', // 图形大小
        },
        series: [
          {
            type: 'bar',
            data: [
              {
                name: '交易结果成功数',
                value: data.list[0].value,
                itemStyle: {
                  color: '#96C8C7',
                },
              },
            ],
            coordinateSystem: 'polar',
            roundCap: true,
            barWidth: 15,
            barGap: '-100%',
            z: 2,
          },
          {
            // 底色环
            type: 'bar',
            data: [
              {
                value: 100,
                itemStyle: {
                  color: '#F2F5FB',
                },
              },
            ],
            coordinateSystem: 'polar',
            roundCap: true,
            barWidth: 15,
            barGap: '-100%',
            z: 1,
          },
        ],
      };
    myChart.setOption(option);

    myChart.index = 0;
    myChart.oldIndex = -1;
    myChart.total = data.list.length;
    myChart.on('click', function (params) {
        if (params.componentSubType === "pie") {
            let statusName = params.data.name;
            app.linkStatus = statusName;
            api.getAirBoxListByStatus(id, statusName, function (d) {
                app.arrayDataAll = d;
                app.totalCount = app.arrayDataAll.length;
                app.showPage(app.pageCurrent, true);
                var $modal = $('#myModal');
                $modal.modal({ backdrop: 'static' });
                $modal.on('shown.bs.modal', function () {
                    var $this = $(this);
                    var $modal_dialog = $this.find('.modal-dialog');
                    var m_top = ($(window).height() - $modal_dialog.height()) / 2;
                    $modal_dialog.css({ 'margin': m_top + 'px auto' });
                });
            });
        }
    });
};

